<script setup name="InfoDialog" lang="ts">
import { getLawFirm } from '@/api/lawfirm/lawfirm';
import { LawFirmVo, LawFirmForm } from '@/api/lawfirm/lawfirm/types';
import { parseTime } from '@/utils/summer';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;

const emit = defineEmits(['refresh']);

const infoDialogFormRef = ref();
const commentTabPaneRef = ref();
const caseTabPaneRef= ref();
const lawFirmId = ref();
const initInfoFormData : LawFirmForm = {
  lawFirmId: undefined,
  lawFirmName: undefined,
  lawFirmLogo: undefined,
  lawFirmType: '1',
  lawFirmDesc: undefined,
  lawFirmAddress: undefined,
  province: undefined,
  city: undefined,
  district: undefined,
  rating: 0,
  curated: '0',
  followers: 0,
  certification: '1',
  yearServiceTime: undefined,
  contactPhone: undefined,
  contactName: undefined,
  account: undefined,
  password: undefined,
  districtId: undefined
};
const state = reactive({
  form: { ...initInfoFormData },
  dialog: {
    visible: false,
    title: ''
  }
});
const { form, dialog } = toRefs(state);
const disableLawyer = ref(false);
const reset = () => {
  form.value = { ...initInfoFormData };
  infoDialogFormRef.value?.resetFields();
};

const openDialog = async (row: LawFirmVo) => {
  reset();
  const _lawFirmId = row.lawFirmId;
  lawFirmId.value = _lawFirmId;
  const res = await getLawFirm(_lawFirmId);
  Object.assign(form.value, res.data);
  if (form.value.lawFirmType === '1') {
    disableLawyer.value = true;
  } else {
    disableLawyer.value = false;
  }
  dialog.value.visible = true;
  dialog.value.title = '查看详情';
};

const cancel = () => {
  reset();
  dialog.value.visible = false;
};

const handelComment = () => {
  commentTabPaneRef.value.initTabPane(lawFirmId.value);
};

defineExpose({
  openDialog
});
</script>

<template>
  <el-dialog :title="dialog.title" v-model="dialog.visible" width="998px" append-to-body>
        <el-form ref="infoDialogFormRef" :model="form" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="封面图片" prop="lawFirmLogo">
                <el-image :src="form.lawFirmLogo" :preview-src-list="[form.lawFirmLogo]" :preview-teleported="true" fit="cover" style="width: 148px;height: 120px"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="名称" prop="lawFirmName">
            <el-input v-model="form.lawFirmName" type="text" readonly />
          </el-form-item>
          <el-form-item label="类型" prop="lawFirmType">
            <el-text v-if="form.lawFirmType === '1'">律师</el-text>
            <el-text v-else>律所</el-text>
          </el-form-item>
          <el-form-item label="区域" prop="district">
            <el-input v-model="form.district"  readonly />
          </el-form-item>
          <el-form-item label="联系地址" prop="lawFirmAddress">
            <el-input v-model="form.lawFirmAddress" type="text" readonly />
          </el-form-item>
          <el-form-item label="标签" prop="lawFirmTag">
            <el-input v-model="form.lawFirmTag" type="textarea" :rows="3" readonly />
          </el-form-item>
          <el-form-item label="联系电话" prop="contactPhone">
            <el-input v-model="form.contactPhone" type="text" readonly />
          </el-form-item>
          <el-form-item label="登录账号" prop="account">
            <el-input v-model="form.account" type="text" readonly />
          </el-form-item>
          <el-form-item label="执业认证" prop="certification">
            <el-text v-if="form.certification === '1'">已认证</el-text>
            <el-text v-else>未认证</el-text>
          </el-form-item>
          <el-form-item label="执业开始时间" prop="yearServiceTime">
            <el-date-picker v-model="form.yearServiceTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" disabled />
          </el-form-item>
          <el-form-item label="简介" prop="lawFirmDesc">
            <el-input v-model="form.lawFirmDesc" type="textarea" :rows="3" readonly />
          </el-form-item>
          <el-form-item label="擅长" prop="special">
            <el-input v-model="form.special" type="textarea" :rows="3" readonly />
          </el-form-item>
        </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button :loading="buttonLoading" type="primary" @click="cancel">关 闭</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<style scoped lang="scss">

</style>
